<template>
    <div>
      <el-form ref="editForm" :model="formFileds">
        <el-row :gutter="24">
  
          <el-col :span="12">
            <el-form-item>
              <el-input></el-input>
            </el-form-item>
          </el-col>
  
          <el-col :span="12">
            <el-form-item>
              <el-button type="primary">
                查询
              </el-button>
  
              <el-button type="primary" @click="add()">
                增加
              </el-button>
  
            </el-form-item>
          </el-col>
  
        </el-row>
  
  
      </el-form>
      <!--表格内容-->
      <el-table ref="list" :data="tableData" style="width: 100%;margin-bottom: 5=1px;" border stripe highlight-current-row
      @row-click="setCurRowChecked"
        :default-sort="{ prop: 'sx', order: 'sx' }">
        <!-- v-for="item in tableData" v-bind:key="item.index" -->
        <el-table-column fixed type="selection" width="45">
        </el-table-column>
        <el-table-column property="name" label="名称" align="center">
        </el-table-column>
        <!-- <el-form-item label="发布状态" prop="fbzt">
          <el-switch ></el-switch>
        </el-form-item> -->
        <el-table-column property="fbzt" label="发布状态" align="center">
          <template slot-scope="scope">
            <el-switch v-model="scope.row.fbzt" @change="handleChange(scope.row)"></el-switch>
          </template>
        </el-table-column>
        <el-table-column property="sx" label="顺序" align="center">
        </el-table-column>
        <el-table-column fixed="right" label="操作" align="center">
          <template slot-scope="scope">
            <!-- <el-button circle icon="el-icon-refresh" title="重置密码" type="success" size="small"></el-button>
            <el-button circle icon="el-icon-phone" title="变更手机号" type="success" size="small"></el-button> -->
            <el-button circle icon="el-icon-edit-outline" type="primary" @click="rowEdit(scope.row)" title="编辑" size="small">
            </el-button>
            <el-button circle icon="el-icon-delete" type="danger" title="删除" size="small"
              @click="rowDel(scope.row.id)"></el-button>
          </template>
        </el-table-column>
      </el-table>
      <!--分页-->
      <el-pagination :page-sizes="[10, 20, 30, 40, 100]" :page-size=this.pageSize :total=this.total :current-page="currentPage" 
    layout="total, sizes, prev, pager, next, jumper" @current-change="getCurrentPage" @size-change="getSize">
    </el-pagination>
  
      <Add v-if="isShowAddDialog" :isShowAddDialog="isShowAddDialog" @dialogClose="dialogClose"></Add>
      <Compile v-if="isShowComDialog" :isShowComDialog="isShowComDialog" @dialogClose="dialogClose" :rowData="rowData"></Compile>
    </div>
  </template>
     
  <script>
  import Add from "./auctionProcessAdd.vue";
  import Compile from "./auctionProcesscomple.vue";
  import { getAllJmxz,deleteJmxz,updateJmxz } from '@/api/systemAdministrator/auctionProcess';
  
  export default {
    name: "auctionProcess",
    components: {
      Add,
      Compile,
    },
    data() {
      return {
        formFileds: {
        },
        tableData: [
        {
        id: 0,
        name: '',
        fbzt: '',
        sx: 0,
        nr: "",
        bz: '',
        },
        ],
        
        pageSize: 10,
        total: 0,
        currentPage: 1,
        editProps: '',
        isShowAddDialog:false,
        isShowComDialog:false,
        rowData: {},
      }
    },
    methods: {
      getCurrentPage(currentPage){
        // console.log(currentPage);
        this.currentPage = currentPage;
        this.getList();
      },
      getSize(pageSize){
        // console.log(pageSize);
        this.pageSize = pageSize;
        this.getList();
      },
      rowEdit(row) {
        // if(row.fbzt == '已提交'){
        //   row.fbzt = true;
        // }
        // else{
        //   row.fbzt = false;
        // }
        
        // //当前选中行
        this.rowData = row;
        console.log('2',row.fbzt);
        this.isShowComDialog = true;
      },
      dialogClose() {
        this.isShowEditDialog = false;
        this.isShowAddDialog = false;
        this.isShowComDialog = false;
        this.getList();
      },
      // handleEdit(id) {
      //   this.$refs.editForm.validate(isValid => {
  
      //     if (!isValid) return;
  
      //     // 保存编辑后的数据
      //     Object.assign(this.tableData[id], this.formFileds);
      //     this.isShowEditDialog = false;
  
      //     // 考虑到可能编辑了日期-需要重新排序
      //     // ***注意：手动排序传参和表格的default-sort属性格式不太一样
      //     this.$refs.list.sort('date', 'descending');
  
      //     this.$message.success('编辑成功');
      //   });
      // },
      getList(){
            this.param = 'pageno=' + this.currentPage + '&countonepage=' + this.pageSize;
            getAllJmxz(this.param).then((res) => {
                if(res){
                    console.log(res.data);
                    this.tableData = res.data.list;
                    this.tableData1 = Object.assign(res.data.list, {});
                    this.total = res.data.total;
                    for(let item of this.tableData1){
                      if(item.fbzt == '已提交'){
                        item.fbzt = true;
                      }
                      else{
                        item.fbzt = false;
                      }
                    }
                    this.tableData = Object.assign(this.tableData1, {});
                }
            })
        },
      add() {
        // console.log("add");
        this.isShowAddDialog = true;
      },
      Compile() {
        // console.log("Compile");
        this.isShowComDialog = true;
      },
      
      rowDel(id) {
        // this.formFileds = row;
        console.log(id);
            this.$confirm('确定要删除当前行吗？', '删除', {
                comfirmButtonText: '确定',
                cancelButtonText: '取消'
            }).then(() => {
                deleteJmxz(id).then((res) => {
                    if(res){
                        console.log(res.data);
                        this.tableData.splice(id, 1);
                        this.$message.success('删除成功');
                        this.getList();
                    }
                })
            });
      },
      // 选中当前行-当前行的复选框被勾选
      setCurRowChecked(row) {
  
        // this.$refs.list.clearSelection();
        // this.$refs.list.toggleRowSelection(row);
        console.log(row);
      },
      handleChange(row){
        let data = Object.assign(row, {});
        // data.fbzt = !data.fbzt;
        if(data.fbzt == true){
          data.fbzt = '已提交';
        }
        else{
          data.fbzt = '未提交';
        }
        console.log('data',data);
        updateJmxz(data).then((res) => {
          if(res){
            console.log('res',res.data);
            this.getList();
          }
        })
      },
    },
    mounted(){
        this.getList();
        // console.log(this.tableData);
        // console.log(new Date().toLocaleString());
    }
  }
  </script>
    
  <style scoped lang="less">
  .el-form {
    padding: 0 10px;
  }
  
  .el-date-editor {
    width: 100% !important;
  }
  </style>
    